<template>
  <div class="layout-container">
    <!-- 标签栏 路由出口 -->
    <router-view></router-view>

    <van-tabbar v-model="active" route active-color="#00cca2">
      <van-tabbar-item to="/home">
        <i slot="icon" class="iconfont icon-shouye"></i>
        <span class="text">首页</span>
      </van-tabbar-item>
      <van-tabbar-item to="/wealth" icon="search">
        <i slot="icon" class="iconfont icon-caifu"></i>
        <span class="text">财富</span>
      </van-tabbar-item>
      <van-tabbar-item to="/living" icon="friends-o">
        <i slot="icon" class="iconfont icon-shenghuo"></i>
        <span class="text">生活</span>
      </van-tabbar-item>
      <van-tabbar-item to="/rural" icon="setting-o">
        <i slot="icon" class="iconfont icon-xiangcunzhenxing"></i>
        <span class="text">乡村振兴</span>
      </van-tabbar-item>
      <van-tabbar-item to="/my" icon="setting-o">
        <i slot="icon" class="iconfont icon-wode"></i>
        <span class="text">我的</span>
      </van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  name: "LayoutIndex",
  components: {},
  props: {},
  data() {
    return {
      active: 0, // 当前显示的标签栏
    };
  },
  created() {},
  mounted() {},
  methods: {},
  computed: {},
  watch: {},
};
</script>

<style scoped lang="less">
.text {
  color: #000;
  font-weight: 600;
}
</style>
